<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:p="http://primefaces.org/ui"
	template="/templates/userLayout.xhtml">

	<ui:define name="pageTitle">#{out.index_title}</ui:define>

	<ui:define name="head-extra">
		<!-- custom css -->

	</ui:define>

	<ui:define name="dialogs">

	</ui:define>

	<ui:define name="content">
		<h1>Order</h1>
		<h:form id="order_form" styleClass="orderFormPanel">
			<p:wizard>
				<p:tab id="order_details" title="Order Details"
					styleClass="orderFormPanel">
					<p:panel header="Order Details" styleClass="orderFormPanel">
						<p:dataTable var="product"
							value="#{cartOrderController.cartController.cart}">
							<p:column headerText="Name">
								<h:outputText value="#{product.product.name}" />
							</p:column>
							<p:column headerText="Price of 1 product">
								<h:outputText
									value="#{product.product.isSpecial?product.product.specialPrice:product.product.price}" />
							</p:column>
							<p:column headerText="Quantity">
								<h:outputText value="#{product.quantity}" />
							</p:column>
							<p:column headerText="Cost">
								<h:outputText value="#{product.cost}" />
							</p:column>
							<p:column>
								<p:commandButton icon="ui-icon-disk" value="Remove"
									action="#{cartController.removeElementFromCart(product)}"
									update=":cart, :order_form" />
							</p:column>
						</p:dataTable>
						<br />
						<p:panelGrid columns="2">
							<h:outputText value="Cost:" />
							<h:outputText value="#{cartController.cost}" />
						</p:panelGrid>
					</p:panel>
				</p:tab>
				<p:tab id="personal_details" title="Personal Details">
					<p:panel header="Personal Details" styleClass="orderFormPanel">
						<p:panelGrid columns="2" style=" margin: 0 auto; width: 400px;"
							rendered="#{cartOrderController.selectedPartner!=null}">
							<h3>Name:</h3>
							<h:outputText value="#{cartOrderController.selectedPartner.name}" />
							<h3>Address:</h3>
							<h:outputText
								value="#{cartOrderController.selectedPartner.address}" />
						</p:panelGrid>
						<p:panelGrid columns="1" styleClass="orderFormPanel"
							style="width: 400px;"
							rendered="#{cartOrderController.selectedPartner==null}"
							header="Log in!">
							<h1 style="color: red;">
								<h:outputText value="Sorry, you have to Log in!" />
							</h1>
							<p:commandButton icon="ui-icon-disk" value="Login"
								action="#{menuView.redirectToUrl('/pages/unsecure/login.xhtml')}" />
							<p:commandButton icon="ui-icon-disk" value="Create new account"
								action="#{menuView.redirectToUrl('/pages/unsecure/signup.xhtml')}" />
						</p:panelGrid>
					</p:panel>
				</p:tab>
				<p:tab id="order_confirm" title="Confirm"
					styleClass="orderFormPanel"
					rendered="#{cartOrderController.selectedPartner!=null}">
					<p:panel header="Confirm" styleClass="orderFormPanel">
						<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
							Mauris ut nunc tortor. Suspendisse eu purus nibh. Ut rhoncus eu
							ipsum in euismod. Sed eros quam, feugiat sed mattis sit amet,
							lacinia id tellus. Etiam lacinia dolor at neque ullamcorper
							auctor. Nulla vulputate eu leo non aliquet. Aenean id erat vel
							dui consequat tincidunt. Mauris nec quam gravida, gravida nibh
							vitae, eleifend justo. Sed non nulla ut erat elementum finibus.
							Pellentesque habitant morbi tristique senectus et netus et
							malesuada fames ac turpis egestas. Pellentesque ut fringilla
							orci.</p>
						<br />
						<p:commandButton value="Create order" update=":cart, :order_form"
							action="#{cartOrderController.saveOrder(request.userPrincipal.name)}" />
					</p:panel>
				</p:tab>
			</p:wizard>
		</h:form>
	</ui:define>
</ui:composition>